<!-- 详情 -->
<template>
	<view class="article">
		<view class="article-header">
			<h1 class="article-title">{{dataDetails.xxbt}}</h1>
			<p class="article-time">
				<span>{{dataDetails.fbr}}</span>
				<span style="color: #245896;">{{dataDetails.xxly}}</span>
				<span>{{dataDetails.fbsj}}</span>
			</p>
		</view>
		<view v-if="dataDetails.tpdz" class="article-cover">
			<imagepdz class="article-cover-Img" :tpdz="dataDetails.tpdz" />

		</view>
		<view class="article-content" v-html="dataDetails.xxnr"></view>
	</view>
</template>

<script setup lang="ts">
	import imagepdz from "../components/image-tpdz.vue";
	import { ref } from 'vue';
	import { onLoad } from '@dcloudio/uni-app'
	import { HlwFbxxDetails } from "@/api/request/HlwFbxxDetails"
	import { HlwFbxx } from '@/api/tables/HlwFbxx'
	let dataDetails = ref<HlwFbxx>({})
	onLoad((option) => {
		let xxid = option.xxid
		getdetails(xxid)
	});

	function getdetails(xxid : string) {
		HlwFbxxDetails({
			data: {xxid},
			success: (result) => {
				dataDetails.value = result
			}
		})
	}
</script>

<style lang="scss" scoped>
	.article {
		padding: 16px 0;
	}

	.article-header {
		margin: 0 16px 24px 16px;
	}

	.article-title {
		margin-top: 0.25rem;
		font-size: 20px;
		font-weight: bold;
		line-height: 1.5;
	}

	.article-time {
		height: 30px;
		line-height: 30px;
		border-bottom: 1px solid #ececec;
		padding: 10px 0;
		margin-bottom: 0.20rem;

		span {
			margin-right: 10px;
			font-size: 12px;
			letter-spacing: 2px;
		}
	}

	.article-cover {
		margin: 24px 16px;
		border-radius: 4px;
		overflow: hidden;
	}

	.article-cover-Img {
		width: 100%;
		object-fit: cover;
	}

	.article-content {
		margin: 24rpx 20rpx;
		// * {
		// 	max-width: 100%;
		// 	background-size: 100%;
		// 	box-sizing: border-box;
		// 	word-wrap: break-word;
		// }

		section {
			margin-bottom: 1.5em;
		}

		h1 {
			font-size: 18px;
			font-weight: 700;
			margin-bottom: 0.9em;
			line-height: 1.4;
		}

		h2 {
			font-weight: 700;
			font-size: 16px;
			margin-bottom: 0.34em;
			line-height: 1.4;
		}

		h3 {
			font-weight: 700;
			font-size: 14px;
			margin-bottom: 0.34em;
			line-height: 1.4;
		}

		p {
			margin: 0 0 0.8em;
		}
	}
</style>